﻿@{
    Layout = "~/Views/Shared/_FormWhite.cshtml";
}

@inject Microsoft.AspNetCore.Hosting.IWebHostEnvironment HostingEnvironment
@section header{
    <link href="@Url.Content("~/lib/summernote/0.8.15/summernote.min.css")" rel="stylesheet" type="text/css">
    <script src='@Url.Content("~/lib/summernote/0.8.15/summernote.js")' type="text/javascript"></script>
    <script src='@Url.Content("~/lib/summernote/0.8.15/lang/summernote-zh-CN.min.js")' type="text/javascript"></script>

    @BundlerHelper.Render(HostingEnvironment.ContentRootPath, Url.Content("~/lib/imageupload/1.0/css/imgup.min.css"))
    @BundlerHelper.Render(HostingEnvironment.ContentRootPath, Url.Content("~/lib/imageupload/1.0/js/imgup.min.js"))

    @BundlerHelper.Render(HostingEnvironment.ContentRootPath, Url.Content("~/lib/bootstrap.tagsinput/0.8.0/bootstrap-tagsinput.min.css"))
    @BundlerHelper.Render(HostingEnvironment.ContentRootPath, Url.Content("~/lib/bootstrap.tagsinput/0.8.0/bootstrap-tagsinput.min.js"))


    @BundlerHelper.Render(HostingEnvironment.ContentRootPath, Url.Content("~/lib/layui/2.7.6/css/layui.css"))
    @BundlerHelper.Render(HostingEnvironment.ContentRootPath, Url.Content("~/lib/layui/2.7.6/layui.js"))
}

<div class="wrapper animated fadeInRight">
    <form id="form" class="form-horizontal m">
        <div class="form-group">
            <label class="col-sm-3 control-label ">订单编号<font class="red"> *</font></label>
            <div class="col-sm-8"> 
                <input id="order_sn" col="order_sn" type="text" readonly class="form-control" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label ">收货人姓名</label>
            <div class="col-sm-8">
                <input id="shipping_user" col="shipping_user" type="text" readonly class="form-control" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label ">收货地址</label>
            <div class="col-sm-8">
                <input id="order_address" col="order_address" type="text" readonly class="form-control" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label ">配送方式<font class="red"> *</font></label>
            <div class="col-sm-8" id="delivery_company" col="delivery_company">
               
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label ">物流单号</label>
            <div class="col-sm-8">
                <input id="delivery_sn" col="delivery_sn" type="text" class="form-control" />
            </div>
        </div>
        <div class="form-group">
             <label class="col-sm-3 control-label ">订单明显</label>
            <div class="col-sm-8">
                <table class="layui-hide" id="tableId" lay-filter="tableEvent"></table>
            </div>
        </div>
    </form>
</div>

 <script type="text/html" id="popupTemplate">
    <div class="layui-form">
      <div class="layui-form-item">
        <label class="layui-form-label">选择项</label>
        <div class="layui-input-block">
          <select id="dynamicSelect" lay-filter="dynamicSelect">
            <!-- 动态加载的下拉选项将在这里展示 -->
          </select>
        </div>
      </div>
    </div>
  </script>
<script type="text/html" id="barDemo">
  <div class="layui-clear-space">
    <a class="layui-btn layui-bg-blue layui-btn-xs" lay-event="edit">
      <i class="fa fa-cart-arrow-down"></i>购车
    </a>
  </div>
</script>  
<script type="text/html" id="headbar">
    <a class="layui-btn layui-btn-xs" lay-event="select"><i class="layui-icon layui-icon-file">购车</i></a>
</script>
<script type="text/javascript">
    var id = ys.request("id");
     $(function () {
         getForm();

         $("#delivery_company").ysComboBox({
            data: ys.getJson(@Html.Raw(typeof(delivery_company).EnumToDictionaryString())),
            class: "form-control"
        });

        

        $('#form').validate({
            rules: {
                order_sn: { required: true },
                delivery_company_select: { required: true },
            }
        });
     });

function getPw() { 
    $("#pw_id").ysComboBox({
            url: '@Url.Content("~/QixingManage/GoodsWarehouse/GetListJson")' + '?goods_id=' + id+'&colorid',
            key: "Id",
            value: "PositionName",
            class: "form-control",
            multiple: true
        });
}

    function getForm() {
        if (id > 0) {
            ys.ajax({
                url: '@Url.Content("~/QixingManage/OrderMaster/GetFormJson")' + '?id=' + id,
                type: 'get',
                success: function (obj) {
                    if (obj.Tag == 1) {
                        obj.Data.order_address = obj.Data.province + "-" + obj.Data.city + "-" + obj.Data.district + "-" + obj.Data.address;
                        $('#form').setWebControls(obj.Data);
                    }
                }
            });
        }
        else {
            var defaultData = {};
            $('#form').setWebControls(defaultData);
        }
    }

    function saveShippingProductForm(index) {
        if ($('#form').validate().form()) {
            var postData = $('#form').getWebControls({ Id: id });
            postData.delivery_company = $('#delivery_company').ysComboBox('getText')
            ys.ajax({
                url: '@Url.Content("~/QixingManage/OrderMaster/SaveShippingProductForm")',
                type: 'post',
                data: postData,
                success: function (obj) {
                    if (obj.Tag == 1) {
                        ys.msgSuccess(obj.Message);
                        parent.searchGrid();
                        parent.layer.close(index);
                    }
                    else {
                        ys.msgError(obj.Message);
                    }
                }
            });
        }
    }


   layui.use(['form','table'], function(){
  var table = layui.table;
  var form = layui.form;
  
  // 已知数据渲染
  var inst = table.render({
    elem: '#tableId',
    url:'@Url.Content("~/QixingManage/OrderDetail/GetPageColourDetailList")',
    where: {orderid:id,order_status:1}, //如果无需传递额外参数，可不加该参数
    lineStyle: 'height: 151px;', // 定义表格的多行样式
   //toolbar:"#headbar",
    cols: [[ //标题栏
      {type: 'checkbox', fixed: 'Id'},
      {field: 'goods_name', title: '商品名称', width: 120},
      {field: 'goods_image', title: '商品图片',width: 120,minWidth: 120,templet: '<div><img src="{{d.goods_image}}" style="max-width:100px;height:100px;"></div>'},
      {field: 'color', title: '颜色', width: 80},
      {
            field: 'goods_cnt', title: '数量', width: 80,templet: function(d){
             return 'x'+d.product_cnt;
          }
      },
      {field: 'VIN', title: '车架号', width: 100},
      {fixed: 'right', title:'操作', width: 134, minWidth: 125, toolbar: '#barDemo'}
    ]],
    skin: 'line', // 表格风格
    //even: true,
    page: false, // 是否显示分页
    parseData: function(res){ // res 即为原始返回的数据
    return {
      "code": res.Tag==1?0:-1, // 解析接口状态
      "msg": res.Message, // 解析提示文本
      "count": res.Total, // 解析数据长度
      "data": res.Data // 解析数据列表
    };
  },
  });

  //table.on('toolbar(tableEvent)', function(obj){
  //      ys.openDialog({
  //          title:'购车',
  //          content: '@Url.Content("~/QixingManage/OrderMaster/SelectCar")' + '?id=' + data.Id+'&colorid='+data.colorid,
  //          width: '450px',
  //          height: '350px',
  //          callback: function (index, layero) {
  //              var iframeWin = window[layero.find('iframe')[0]['name']];
  //              iframeWin.saveForm(index);
  //              form.render();
  //          }
  //       });
  //    });
  table.on('tool(tableEvent)', function(obj){
        var data = obj.data; // Get the data of the current row
        var event = obj.event; // Get the event type
        if(event === 'edit'){
            console.log('View button clicked for ID: ' + data.Id);
            ys.openDialog({
            title:'购车',
                content: '@Url.Content("~/QixingManage/OrderMaster/SelectCar")' + '?id=' + data.Id + '&skuid=' + data.skuid,
            width: '450px',
            height: '350px',
            callback: function (index, layero) {
                var iframeWin = window[layero.find('iframe')[0]['name']];
                iframeWin.saveForm(index);
                form.render();
            }
         });
        }
         
      });
});
</script>